<template>
  <div>
    <el-table
        ref="multipleTable"
        border
        stripe
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
        @selection-change="handleSelectionChange"
      > 
        <el-table-column type="selection" width="70" fixed="left">
            <template slot-scope="scope">
                <el-checkbox :disabled="scope.$index === 0 ? true: false"></el-checkbox>
            </template>
        </el-table-column>
        <el-table-column label="序号" type="index" width="55" fixed="left">
            <template slot-scope="scope">
                <span>{{scope.$index === 0 ? "" : scope.$index}}</span>
            </template>
        </el-table-column>
        <el-table-column v-for="item,index in HeaderData" :key="item.id" :prop="item.name" :label="item.title" width="300">
            <template slot-scope="scope">
                <div v-if='scope.$index == 0'>
                    <el-input v-model="inputVal[index]" size="small" :placeholder="`请输入${item.title}`" v-if="item.url === ''"></el-input>
                    <div v-else>
                        <el-select>
                            <el-option
                                v-for="(item, index) in OpitonsData"
                                :key="index"
                                :value="item.item_code"
                                :label="item.item_name"
                                ></el-option>
                        </el-select>
                    </div>
                </div>
                <div v-else>{{ scope.row[item.name] }}</div>
            </template>
        </el-table-column>
    </el-table>
  </div>
</template>
<script>
export default {
  name: "ceshitable",
  components: {},
  props:["tableData","HeaderData","OpitonsData"],
  data() {
    return {
        inputVal:{},
    }
  },
  watch: {},
  computed: {},
  created(){},
  mounted() {},
  methods: {
      handleSelectionChange(val) {
        this.multipleSelection = val;
        this.sumOrder = val.length;
        if (val.length > 0) {
            for (var i = 0; i < this.multipleSelection.length; i++) {
            this.orderIdNums = this.multipleSelection.map((item) =>
                Number(item.id)
            );
            this.statusId = this.multipleSelection.map((item) => item.status);
            }
        } else {
            this.orderIdNums = [];
            this.statusId = [];
        }
     },
  },
}
</script>
<style lang="less" scoped>

</style>